<template>
  <div class="home">
    <div class="search">
      <van-search
        v-model="value"
        placeholder="请输入搜索关键词"
        show-action
        shape="round"
        @click="$router.push('/search')"
      >
        <template #action>
          <div @click="onSearch">
            <van-icon name="add-o" size="25px" style="margin: 5px 0 0 10px" />
          </div>
        </template>
      </van-search>
    </div>
    <HomeNavBar :navList="navList"></HomeNavBar>
    <!--博客列表-->
    <BlogList></BlogList>
  </div>
</template>

<script setup>
import { ref, onMounted } from "vue";
import HomeNavBar from "./components/HomeNavBar.vue";
import BlogList from "./components/BlogList.vue";
const navList = ref([]);
//读取json文件拿取数据
import { getHomeNavAPI } from "./services/home";
//获取博客数据

//获取我的频道
const getMyPanel = async () => {
  const { data } = await getHomeNavAPI();
  console.log(data);
  let list = data.filter((item) => item.username == "gzt");
  navList.value = list[0].panels;
};
onMounted(async () => {
  getMyPanel();
});
</script>

<style scoped lang="less">
.home {
  box-sizing: border-box;
}
.search {
  background-color: #ff6450;
}
</style>
